Frontend demo · fictional sample contentHTML · CSS · JavaScript

Alumni Gallery

A digital home for finding classmates, browsing yearbooks, and revisiting the stories that connect an alumni community.

Alumni Gallery homepage with yearbook and alumni story previews
Homepage · explore yearbooks and alumni stories · select to view the full capture

This is a fictional demo. Names, profiles, stories, and photographs shown in the application are sample content. School identity and production services still need to be configured before a real launch.

The experience

The interface gives visitors clear paths from a graduating year to people and memories, with a separate route for joining the gallery.

  1. ExploreChoose a yearbook from the home page
  2. FindSearch and filter the alumni directory
  3. RememberBrowse class profiles and memories
  4. JoinOpen the request-access screen

Frontend screenshots

Alumni directory with search, year and program filters, sorting, and profile cards
Directory · find alumni by name, year, or program
2024 yearbook page with class roster, program groups, and memories
Yearbook · explore a graduating class
Alumni memories page with story cards and a graduation-year filter
Memories · browse sample stories by year
Join page with request-access and sign-in tabs and fields for school details
Join · request-access and sign-in interface

What I built

I designed the frontend paths shown here: a story-led homepage, a searchable alumni directory, yearbook pages organized around graduating classes, a memories collection, and a request-access screen. The captures show these interfaces; they do not verify that identity checks or a production backend are connected.

The public demo serves HTML, CSS, and JavaScript. Its underlying framework and production data services have not been verified from this portfolio repository.

Explore the live demo Back to Projects